<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="js/jquery-1.8.1.min.js"></script>
<script type="text/javascript" src="js/jquery.jsmartdrag.js"></script>
<link href="css/jsmartdrag.css" rel="stylesheet" type="text/css" />
<title>jsmartdrag实例页面</title>
<script type="text/javascript">
$(document).ready(function(){
	js = $(".source").jsmartdrag({ 
		target:'.target',
		afterDrag:afterDrag
	});
});
function afterDrag(selected,currentObj,targetSelected){	
	if(selected){
		alert("将元素ID为"+currentObj.attr("id")+"移动到了元素ID为"+targetSelected.attr("id")+"上");	
	}else{
		alert("没有拖动到指定的区域里哦!");
	}
}
</script>
</head>
<body>
	<div id="target1"  class="target">target1</div>
	<div id="target2"  class="target">target2</div>
	<div id="target3"  class="target">target3</div>
	<div id="source1"  class="source" >source1</div>
	<div id="source2"  class="source" >source2</div>
	<div id="source3"  class="source" >source3</div>
</body>
</html>